import React from 'react';
import {BrowserRouter as Router, Route } from 'react-router-dom'
import App from '../App';
import About from '../pages/about'
import Inbox from '../pages/inbox'
import Child1 from '../pages/child1'

const routes = [
  { path: '/',
    component: App
  },
  { path: '/about',
    component: About,
    routes: [
      { path: '/about/child1',
        component: Child1
      },
      { path: '//about/inbox',
        component: Inbox
      }
    ]
  }
]

const Routers = (route) => (
	<Route path={route.path} render={props => (
    // pass the sub-routes down to keep nesting
    <route.component {...props} routes={route.routes}/>
  )}/>
)
export{routes,Routers}
